<template>
  <div id="box">
    <act-list-item v-for="act in acts" :act-item="act.fields" :act-total="act" :imgs="imgs"></act-list-item>
  </div>
</template>

<script>
import ActListItem from "@/components/ActListItem";
import {debounce} from "@/common/utils";
import {getTypeImg} from "@/network/home";
export default {
  name: "ActList",
  components: {
    ActListItem
  },
  data(){
    return{
      imgs: {}
    }
  },
  props: {
    acts: {
      type: Array,
      default() {
        return []
      }
    }
  },
  mounted() {
    //防抖
    const getImg = debounce(this.getTypeImage,20)
    getImg()
  },
  methods: {
    getTypeImage(){
      getTypeImg().then(res => {
        // for(let img in res.data[0]){
        //   this.imgs.push(img)
        // }
        this.imgs = res.data[0]
        // console.log(this.imgs)
        // console.log(res.data[0])
        // console.log(Object.prototype.toString.call(res.data[0]));
      })
    }
  }
}
</script>

<style scoped>
#box {
  width: 100%;
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  /*padding: 2px;*/
}


</style>